<template>
  <span><span v-if="renderColor" :style="style">{{formatValue}}</span><span v-else>{{formatValue}}</span></span>
</template>

<script>
  import {getDataByUrl, getEnum, getDict} from '../../api/getComData'
  import config from '../../config'
  import util from '../../libs/util'

  export default {
    name: 'es-value-format',
    props: {
      data:Array //数据源数组，在列表中使用值转换组件时建议数据源使用data，避免多次请求
      ,dictName: String//字典
      , enumName: String//枚举
      , url: String//url
      , value: [String,Number] //要渲染的值
      , renderColor: Boolean//是否渲染颜色
      , colors: String //渲染的颜色,多个值逗号隔开
      , index: Number//当前数据index
    },
    model: {
      event: 'changeValue'
    },
    data: function () {
      return {
        list: [],
        // formatValue: '',
        style: {
          color: ''
        }
      }
    },
    created(){
   },
  mounted() {
    // this.getDict()

    },
    computed:{
      formatValue:function(){//耗性能，不建议使用
        return this.getDict()
      }
    },
    methods: {
     getDict(){
        let _this = this
       //获取字体颜色
       if (_this.renderColor) {
         let colors = _this.colors ? _this.colors.split(',') : config.colors
         _this.style.color = colors[parseInt(_this.value)]
       }
        if (!_this.value) {
          return ''
        }
        //设置数据源
        if (_this.dictName) {
          _this.list = util.getLocalStorageItem(_this.dictName)
          if (!_this.list) {
            getDict({dictName: _this.dictName}).then((res) => {
              _this.list = res.data
              util.setLocalStorageItem(_this.dictName, res.data)
             return util.getDictValue( _this.list,_this.value);
            })
          } else {
            return util.getDictValue( _this.list,_this.value);
          }
        } else if (_this.enumName) {
          _this.list = util.getLocalStorageItem(_this.enumName)
          if (!_this.list) {
              getEnum({enumName: _this.enumName}).then((res) => {
              _this.list = res.data
              util.setLocalStorageItem(_this.enumName, res.data)
                return  util.getDictValue( _this.list,_this.value);
            })
          } else {
            return util.getDictValue( _this.list,_this.value);
          }
        } else if (_this.url) {
          getDataByUrl(_this.url, {}).then((res) => {
            for (let item in res.data) {
              if (res.data[item].value === _this.value) {

                let str =  res.data[item].label
                return str;
              }
            }
          })
        }
        else if(_this.data){
          return  util.getDictValue( _this.data,_this.value);
        }
        else {
          this.$message.error('未指定数据源')
          return false
        }

      }
    }
  }
</script>

<style scoped>

</style>
